<div class="login-page" [ngStyle]="{'background-color': loginPageConfig.page.extends.backgroundColor}">
    <header class="login-header">
        <div class="logo">
            <img [src]="loginPageConfig.page.extends.logoUrl">
        </div>
    </header>
    <div class="page-content">
        <div class="content-wrapper">
            <div class="img-p">
                <img [src]="loginPageConfig.page.extends.backgroundImage">
            </div>
            <div class="user-input">
                <div class="form-logo">
                    <img [src]="loginPageConfig.page.extends.headUrl">
                </div>
                <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
                    <nz-form-item>
                        <nz-form-control nzErrorTip="请输入用户名">
                            <nz-input-group class="form-input" [nzPrefix]="userPrefix">
                                <input type="text" nzBorderless nz-input formControlName="username"
                                    [(ngModel)]="username" placeholder="用户名" />
                            </nz-input-group>
                            <ng-template #userPrefix>
                                <i class="iconfont icon-user-line"></i>
                            </ng-template>
                        </nz-form-control>
                    </nz-form-item>
                    <nz-form-item>
                        <nz-form-control nzErrorTip="请输入密码">
                            <nz-input-group class="form-input" [nzPrefix]="passwordPrefix">
                                <input type="password" nzBorderless nz-input formControlName="password"
                                    ng-keydown="entersearch()" [(ngModel)]="password" placeholder="密码" />
                            </nz-input-group>
                            <ng-template #passwordPrefix>
                                <i class="iconfont icon-lock-line"></i>
                            </ng-template>
                        </nz-form-control>
                    </nz-form-item>
                    <nz-form-item>
                        <nz-form-control [nzSm]="24" [nzXs]="24" nzErrorTip="请输入验证码">
                            <nz-input-group class="form-input" [nzPrefix]="codePrefix" [nzSuffix]="codeSuffix">
                                <input nz-input nzBorderless formControlName="code" placeholder="验证码" />
                            </nz-input-group>
                            <ng-template #codePrefix>
                                <i class="iconfont icon-profile-line"></i>
                            </ng-template>
                            <ng-template #codeSuffix>
                                <img [src]="verifyCode.code" alt="" (click)="getVerifyCode()">
                            </ng-template>
                        </nz-form-control>
                    </nz-form-item>
                    <p class="forget-password">
                        <a href="javascript:void(0)" (click)="forgetPassword()">忘记密码</a>
                    </p>
                    <button nz-button [ngStyle]="{'background-color': loginPageConfig.page.extends.backgroundColor}"
                        class="login-form-button no-border" nzType="primary" (click)="confirm()">
                        登录
                    </button>
                </form>
            </div>
        </div>
    </div>
    <div class="footer-bg"></div>
    <footer class="arc-content">
        <div class="arc-c-item" *ngFor="let item of loginPageConfig.page.extends.bottomImageList; let index=index">
            <img [src]="item">
        </div>
    </footer>
</div>